﻿@model AidBrella.ViewModels.MappableViewModel

<script  type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"> </script>

<script src="@Url.Content("~/Scripts/js/map.js")" type="text/javascript"></script>


@Html.Partial("Map")
<script type="text/javascript">

    $(window).load(function () {

        var map = GetMap(document.getElementById("mapDiv"), { center: new Microsoft.Maps.Location(5.80, 23.27), zoom: 3 });

        var updatePoints = function () {
            var center = map.getCenter();

            $.getJSON("/Profile/GetUserProjects", { 'longitude': center.longitude, 'latitude': center.latitude }, function (data) {
                map.entities.clear();
                $.each(data.points, function (idx, item) {

                    var loc = new Microsoft.Maps.Location(item.lat, item.lon);

                    var pin = new Microsoft.Maps.Pushpin(loc);
                    var infoboxOptions = { width: 200, height: 100, showCloseButton: true, zIndex: 0, offset: new Microsoft.Maps.Point(-10, 0), showPointer: true };

                    Microsoft.Maps.Events.addHandler(pin, 'click', function () {

                        var defaultInfobox = new Microsoft.Maps.Infobox(loc, infoboxOptions);
                        map.entities.push(defaultInfobox);

                        var returnurl = "/Project/View/";
                        var link = "<a href=" + returnurl + item.id + ">";
                        defaultInfobox.setHtmlContent('<div id="infoboxText">' + link + item.name + '</a> <hr/><p class="infobox-desc">' + item.desc + '</p></div>');
                        var showClose = defaultInfobox.getShowCloseButton();
                    });
                    map.entities.push(pin);
                });
            });
        };

        var mapChange;

        Microsoft.Maps.Events.addHandler(map, 'viewchangeend', function () {
            if (mapChange) { clearTimeout(mapChange); }
            mapChange = setTimeout(updatePoints, 500);
        });
    });  
    
</script>


